import React from 'react'
import {connect} from 'dva'
import {Select} from 'antd'
const Option = Select.Option;

/**
 * [StockSelect 股票选择框]
 */
 class StockSelect extends React.Component {
   state = {
     data:this.props.stockDefinitionList,
     value:this.props.stock,
   }

   componentDidMount() {
    this.fetchData(this.props)
  }
  componentWillReceiveProps(nextProps) {
    if(nextProps.stockDefinitionList!==this.props.stockDefinitionList){
      const data=nextProps.stockDefinitionList
      data.unshift({
        name: "全部股票",
        id: "total"
      })
      this.setState({
        data,
      })
    }
  }

  fetchData=(props)=>{
    props.dispatch({
      type: `dailyReplay/getTraderStockDefinitionList`,
      payload:props
    })
  }


   handleChange = (value) => {     
     this.setState({
       value,
     })
     this.changeRouter(value)
   }
   changeRouter(stockVal) {
     //  保存查询参数到URL
    const payload=this.props.location
    payload.query.stock=stockVal

    this.props.dispatch({
      type: `app/changeRouter`,
      payload
    })
    this.props.dispatch({
      type: `dailyReplay/getTSDefinitionList`,
      payload
    })
  }

   render() {
     const {value,data}=this.state
     return (
       <Select
         showSearch
         style={{width: 120}}
         value={value}
         optionFilterProp="children"
         onChange={this.handleChange.bind(this)}
         filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
         >
         {
           data.map((item,index)=><Option value={item.id} key={index}>{item.name}</Option>)
         }
       </Select>
     )
   }
 }

 StockSelect.defaultProps={
   //开始时间 => begindate
  begindate:null, 
  //结束时间 => enddate
  enddate:null, 
  //交易员列表 => stockDefinitionList
  stockDefinitionList:[], 
  //当前交易员ID => trader
  stock:'total', 
  //当前路由 => location
  location:{
    pathname:'/tradeReplay/dailyReplay',
    query:{},
  }
 }

 export default connect()(StockSelect)
